<template>
    <a-spin :spinning="spinning">
    <base-breadcrumb :breadcrumb="!isAudit && !isAudits">
        <a-card :bordered="false">
            <title-name title="设计问题上报"></title-name>
            <a-form-model
                    ref="ruleForm"
                    :model="form"
                    :rules="rules"
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 20 }"
            >
                <a-row>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="所属单位" prop="projectId">
                            <org-tree-select
                                    v-model="form.projectId"
                                    check-strictly
                                    is-need-auth
                                    :is-auto-select-first="editModel == 2"
                                    @getProjectInfo="getProjectInfo"
                                    :disabled="editModel == 0"
                            ></org-tree-select>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="项目设计管理类别">
                            <a-input v-model="form.designTypeName" disabled/>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="问题名称" prop="name">
                            <a-input v-model="form.name" placeholder="请输入，如 图纸质量影响现场施工"  :disabled="editModel == 0"/>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="专业类别" prop="professionalType">
                            <a-select v-model="form.professionalType" placeholder="请选择"  :disabled="editModel == 0">
                                <a-select-option value="CIVIL">
                                    建筑
                                </a-select-option>
                                <a-select-option value="ELECTRICAL">
                                    机电
                                </a-select-option>
                                <a-select-option value="STRUCTURE">
                                    结构
                                </a-select-option>
                                <a-select-option value="LANDSCAPE">
                                    市政景观
                                </a-select-option>
                            </a-select>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="问题类型" prop="problemType">
                            <a-radio-group name="radioGroup" v-model="form.problemType"  :disabled="editModel == 0">
                                <a-radio :value="1">
                                    突发
                                </a-radio>
                                <a-radio :value="2">
                                    紧急
                                </a-radio>
                            </a-radio-group>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="提出人" prop="reportId" >
                            <selectPerson
                                    show-search
                                    :disabled="editModel == 0"
                                    v-model="form.reportId"
                                    placeholder="请选择"
                                    :userList="userList"
                                    needFilterDuplicate
                                    @personChanged="personChanged"
                            ></selectPerson>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="创建人">
                            <a-input v-model="form.creator" disabled/>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="8">
                        <a-form-model-item ref="name" label="创建时间">
                            <a-input v-model="form.createTime" disabled/>
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="24">
                        <a-form-model-item ref="name" label="问题概述" prop="description">
                            <base-textarea
                                    :disabled="editModel == 0"
                                    v-model="form.description"
                                    :maxLength="300"
                                    :auto-size="{ minRows: 3, maxRows: 10 }"
                            ></base-textarea>
                        </a-form-model-item>
                    </a-col>
                </a-row>

            </a-form-model>
        </a-card>

        <a-card>
            <title-name title="附件"></title-name>
            <div v-if="editModel == 0&&fileIds.length" style="margin-bottom: 5px">
                <a-button type="primary" @click="downloadFile('PROBLEM_REPORT_ANNEX')" :loading="fileLoading">批量下载附件</a-button>
            </div>
            <BTableUpload v-model="fileIds" :business-code="businessCode" btnName="上传附件"  :disabled="editModel == 0">
            </BTableUpload>
        </a-card>

        <template v-if="form.dealType&&!useComponent">
            <a-card>
                <title-name title="处理"></title-name>
                <a-form-model layout="horizontal" :label-col="{ span:4 }"
                              :wrapper-col="{ span: 14 }">
                    <a-row>
                        <a-col :span="8">
                            <a-form-model-item ref="name" label="问题处理方式">
                                <a-radio-group name="radioGroup" v-model="form.dealType" disabled>
                                    <a-radio :value="1">
                                        本人处理
                                    </a-radio>
                                    <a-radio :value="2">
                                        转办处理
                                    </a-radio>
                                </a-radio-group>
                            </a-form-model-item>
                        </a-col>
                        <a-col :span="8" v-if="form.transferor">
                            <a-form-model-item ref="name" label="转办人" >
                                <a-input v-model="form.transferor" disabled/>
                            </a-form-model-item>
                        </a-col>
                        <a-col :span="8" v-if="form.receiverId">
                            <a-form-model-item ref="name" label="转办给" >
                                <a-input v-model="form.receiver" disabled/>
<!--                                <selectPerson-->
<!--                                        disabled-->
<!--                                        v-model="form.receiverId"-->
<!--                                        placeholder="请选择"-->
<!--                                        :userList="userList"-->
<!--                                ></selectPerson>-->
                            </a-form-model-item>
                        </a-col>
                        <a-col :span="24" v-if="form.transSuggestion">
                            <a-form-model-item label="转办建议">
                                <BaseTextarea v-model="form.transSuggestion" placeholder="" disabled/>
                            </a-form-model-item>
                        </a-col>
                        <a-col :span="24">
                            <a-form-model-item label="处理意见">
                                <BaseTextarea v-model="form.suggestion" placeholder="" disabled/>
                            </a-form-model-item>
                        </a-col>
                    </a-row>
                </a-form-model>
                <title-name title="解决方案"></title-name>
                <div v-if="editModel == 0&&form.suggestFile.length" style="margin-bottom: 5px">
                    <a-button type="primary" @click="downloadFile('PROBLEM_REPORT_SOLUTION')" :loading="fileLoading">批量下载附件</a-button>
                </div>
                <BTableUpload v-model="form.suggestFile" :business-code="businessCode" btnName="上传附件" disabled>
                </BTableUpload>
            </a-card>


            <a-card v-if="!isAudit && !isAudits&&(form.applyInfo || form.applyFile.length)">
                <title-name title="现场实施情况"></title-name>
                <a-form-model layout="horizontal" :label-col="{ span:4 }"
                              :wrapper-col="{ span: 14 }">
                    <a-row>
                        <a-col :span="24">
                            <a-form-model-item label="现场实施情况">
                                <BaseTextarea v-model="form.applyInfo" placeholder="" disabled/>
                            </a-form-model-item>
                        </a-col>
                    </a-row>
                    <a-form-model-item label="现场实施照片">
                        <l-table
                                uploadType="image"
                                :editModel="2"
                                :business-code="businessCode"
                                :upload-arrys.sync="form.applyFile"
                                disabled
                        />
                    </a-form-model-item>
                </a-form-model>
            </a-card>
        </template>
        <template v-if="!isAudit && !isAudits">
        <div style="float: right" class="page-btn-right-top">
            <a-button type="primary" @click="submit('DRAFT')" :loading="loading" v-if="editModel!=0"> 保存草稿</a-button>
            <a-button type="primary" @click="submit('SUBMITTED')" :loading="loading" class="ml12" v-if="editModel!=0"> 提交</a-button>
            <a-button class="ml12" type="primary" @click="goBack" v-if="!isAudits"> 关闭</a-button>
        </div>
        </template>
        <selectApprover :businessId="businessId" :processConfig="setProcessConfig"></selectApprover>
    </base-breadcrumb>
    </a-spin>
</template>

<script>
  import moment from 'moment'
  import selectPerson from './selectPerson'
  import { problemReportAdd, problemReportDetail, problemReportEdit, problemReportBatchExport } from '@/api/design/designRegister'

  export default {
    name: 'designIssueReportingAed',
    components: {
      selectPerson
    },
    props: {
      useComponent: {
        type: Boolean,
        default: false
      },
      isAudit: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
          isAudits: false,
          spinning: false,
        //获取流程配置值
        processConfig: null,
        //点击提交发送流程配置值
        setProcessConfig: null,
        businessId: null,
        loading: false,
        form: {
          designTypeName: '',
          designTypeId: '',
          createTime: '',
          creator: '',
          description: '',
          problemType: void 0,
          professionalType: void 0,
          reportId: void 0,
          name: '',
          branchCompanyId: '',
          projectId: '',
          fileListDTO: [],
          status: ''
        },
        userList: [],
        rules: {
          projectId: [{ required: true, message: '请选择所属单位', trigger: 'change' }],
          professionalType: [{ required: true, message: '请选择专业类别', trigger: 'change' }],
          name: [{ required: true, message: '请输入问题名称', trigger: 'blur' }],
          reportId: [{ required: true, message: '请选择提出人', trigger: 'change' }],
          problemType: [{ required: true, message: '请选择问题类型', trigger: 'change' }],
          description: [{ required: true, message: '请输入问题概述', trigger: 'blur' }]
        },
        businessCode: 'PM18',
        fileIds: [],
        editModel: 2,
        fileLoading: false,
        id: ''
      }
    },
  async created() {
      this.editModel = this.$route.query.editModel || 0
      if (this.editModel != 2) {
        this.id = this.$route.query.id //'966240256313663488'
        if(this.$route.query.bussinessId) {
          this.id = this.$route.query.bussinessId
          this.isAudits = true
          this.editModel = 0
        }
        this.problemReportDetail()
      } else {
        this.form.creator = this.$userInfo().name
        this.form.createTime = moment().format('YYYY-MM-DD')
      }
      // this.processConfig = await this.$getConfigFn('design_problem_bring_case_process')
    },
    methods: {
      personChanged(val) {
        this.form.reportName = val.name
      },
      downloadFile(val) {
        const data = {
          id: this.id,
          typeEnum: val,
          urlStr: window.location.origin
        }
        this.fileLoading = true
        problemReportBatchExport(data).then(res=>{
          this.fileLoading = false
           this.handleDownload(res)
        })
      },
      getProjectInfo(info) {
        this.form.designTypeId = info.designId
        this.form.designTypeName = info.designName
      },
      problemReportDetail() {
          this.spinning = true
        problemReportDetail(this.id).then(res => {
            this.spinning = false
          if(!res.data.suggestFile) {
            res.data.suggestFile = []
          }
          if(!res.data.applyFile) {
            res.data.applyFile = []
          }
          if(!res.data.fileList) {
            res.data.fileList = []
          }
          this.fileIds = res.data.fileList
          this.form = res.data
          this.$emit('finish', res.data)
          if(this.form.designType) {
            this.form.designTypeName = this.form.designType.name
            this.form.designTypeId = this.form.designType.id
          }
          if(this.editModel == 1) {
            this.form.creator = this.$userInfo().name
            this.form.createTime = moment().format('YYYY-MM-DD')
          }
          if(res.data.reportId) {
            this.userList = [
              {
                employeeId: res.data.reportId,
                employeeName: res.data.reportName
              }
            ]
          }
        })
      },
      submit(val) {
        const submit = ()=>{
          this.form.status = val
          let arr = []
          this.fileIds.forEach(item => {
            arr.push(item.commonId)
          })
          const data = {
            ...this.form,
            fileListDTO: arr,
            designType: {
              name: this.form.designTypeName,
              id: this.form.designTypeId
            }
          }
          if(!this.form.designTypeName) {
            delete data.designType
          }
          this.loading = true
          if(this.editModel == 1) {
            problemReportEdit(data).then(res=>{
              this.loading = false
              let msg = val === 'DRAFT' ? '保存草稿成功': '提交成功'
              this.$message.success(msg)
              // if(val === 'DRAFT') {
                this.$router.replace('/design/designNeed/designIssueReporting')
              // } else {
              //   this.setProcessConfig = this.processConfig
              //   this.businessId = res.data.id
              // }
            }).catch(()=>{
              this.loading = false
            })
          } else {
            problemReportAdd(data).then(res => {
              this.loading = false
              let msg = val === 'DRAFT' ? '保存草稿成功': '提交成功'
              this.$message.success(msg)
              // if(val === 'DRAFT') {
                this.$router.replace('/design/designNeed/designIssueReporting')
              // } else {
              //   this.setProcessConfig = this.processConfig
              //   this.businessId = res.data.id
              // }
            }).catch(()=>{
              this.loading = false
            })
          }
        }
        if(val === 'DRAFT') {
          submit()
          return
        }
        if(!this.form.designTypeName) {
          this.$message.warning('请先设置项目管理工程类别')
          return
        }
        this.$refs.ruleForm.validate(valid => {
          if (valid) {
              this.submitApprovalConfirm(6, (flag) => {
                if(!flag) {
                  this.loading = false
                  return
                }
                submit()
              })
          } else {
            this.$message.warning('请填写完所有必填项信息')
          }
        })
      },
      goBack() {
          if(this.$route.query.path) {
              this.$router.replace('/project/design/knowledgeBase/designIssues')
              return
          }
        this.$router.replace('/design/designNeed/designIssueReporting')
      },
      // 下载
      handleDownload(res) {
        const blob = new Blob([res.data])
        const filename = decodeURIComponent(res.headers['content-disposition'].split('filename=')[1])
        const downloadElement = document.createElement('a')
        const href = window.URL.createObjectURL(blob) // 创建下载的链接
        downloadElement.href = href
        downloadElement.download = filename.substring(filename.indexOf("''") + 1) // 获取文件名
        document.body.appendChild(downloadElement)
        downloadElement.click() //点击下载
        document.body.removeChild(downloadElement) //下载完成移除元素
        window.URL.revokeObjectURL(href) //释放blob对象
      },
    }
  }
</script>

<style scoped>

</style>